@charset "utf-8";

/*@font-face {font-family: 'iconfont';
    src: url('iconfont.eot');
    src: url('iconfont.eot?#iefix') format('embedded-opentype'),
    url('iconfont.woff') format('woff'),
    url('iconfont.ttf') format('truetype'),
    url('iconfont.svg#iconfont') format('svg');
}*/

html,body{
	height: 100%;
	width: 100%;
}

body {
	padding-top: 134px;
	color: black;
}
@font-face {
  font-family: 'iconfont';
  src: url('//at.alicdn.com/t/font_1453625956_280045.eot'); /* IE9*/
  src: url('//at.alicdn.com/t/font_1453625956_280045.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
  url('//at.alicdn.com/t/font_1453625956_280045.woff') format('woff'), /* chrome、firefox */
  url('//at.alicdn.com/t/font_1453625956_280045.ttf') format('truetype'), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
  url('//at.alicdn.com/t/font_1453625956_280045.svg#iconfont') format('svg'); /* iOS 4.1- */
}

.iconfont{
	font-family:"iconfont" !important;
	font-size:16px;
	font-style:normal;
	-webkit-font-smoothing: antialiased;
	-webkit-text-stroke-width: 0.2px;
	-moz-osx-font-smoothing: grayscale;
}

*[data-icon]{
	&::before{
		font-family: "iconfont" !important;
		content: attr(data-icon);
		display: inline-block;
		font-style: normal;
	}
}
a {
	text-decoration: none !important;
}
.bread-nav {
  color: #9a9a9b;
  a {
  	color: #9a9a9b;
  &:last-of-type {
    color: black;
  };
  }	
  
}
.bread-nav>a + a:before {
  content: '>';
  color: #9a9a9b;
  padding: 0 3px;
}
.fl {
	float: left;
}
.fr {
	float: right;
}
h1,h2,h3,h4,h5 {
	font-family:"微软雅黑";
}
*{
	font-family:"微软雅黑", Avenir, "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Source Han Sans CN", "Source Han Sans SC", "Microsoft YaHei", "ST Heiti", SimHei;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	text-decoration: none;
	&:focus {
		outline: 0;
	}
}
.wrap {
	width: 1200px;
	margin: 0 auto;
}
ul{
	list-style:none;
	margin:0px;
	padding:0px;
}

a{
	color: #000;
	text-decoration: none;
}
a:hover,a:active {
	text-decoration: none !important; 
}

.pic{
	*{
		color: #fff;
	}
}

.fl{
	float:left;
}
.fr{
	float:right;
}
.clear{
	clear:both;
}
.clearfix{
	overflow:auto;zoom:1;
}
.cl{
	clear:left;
}
.cr{
	clear:right;
}
.mt10{
	margin-top:10px!important;
}
.mt20{
	margin-top:20px!important;
}
.mt40{
	margin-top:40px!important;
}
.ml20{
	margin-left:20px!important;
}

[v-cloak] {
	display: none;
}

#spinner{
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background-color: rgba(255,255,255,.8);
	z-index: 999;
	display: none;
}

#spinner i {
	height: 50px;
	width: 50px;
	left: 50%;
	top: 50%;
	position: absolute;
	margin-top: -25px;
	margin-left: -25px;
	background-color: #05a2e9;
	-webkit-mask: url(../img/bars.svg) no-repeat;
	mask: url(../img/bars.svg) no-repeat;
	-webkit-mask-size: 100%;
	mask-size: 100%;
}

.nav.main{
	width: 100%;
	height: 56px;
	border-top: 1px solid #666;
	position: fixed;
	bottom: 0;
	background-color: #fff;
	.menu{
		height: 100%;
		>div{
			width: 25%;
			height: 50px;
			float: left;
			text-align: center;
			font-size: 12px;
			position: relative;
			i{
				font-size: 26px;
			}
			span{
				font-size: 14px;
			}
			&.on *{
				color: #05a2e9;
				font-weight: bold;
			}
		}
		/*.tj{
			&::before{
				width: 44px;
				height: 44px;
				background-image:url(../img/tj.png);
			}
			&.on::before{
				background-image:url(../img/tj_on.png);
			}
		}
		.hd{
			&::before{
				width: 42px;
				height: 47px;
				background-image:url(../img/hd.png);
			}
			&.on::before{
				background-image:url(../img/hd_on.png);
			}
		}
		.px{
			&::before{
				width: 48px;
				height: 39px;
				background-image:url(../img/px.png);
			}
			&.on::before{
				background-image:url(../img/px_on.png);
			}
		}
		.wd{
			&::before{
				width: 36px;
			height: 37px;
				background-image:url(../img/wd.png);
			}
			&.on::before{
				background-image:url(../img/wd_on.png);
			}
		}*/
	}
}

.accessible {
	position: absolute;
	left: -9999px;
}

header {
	width: 100%;
	z-index: 999;
	position: fixed;
	top: 0;
	height: 134px;
	background: white;
	box-shadow: 0px 3px 5px #ddd;
	.gray-head {
		height: 49px;
		width: 100%;
		background: url('../images/background/gray-bg.png') repeat-x;
		.wrap>div {
			float: right;
			width: 550px;
			line-height: 50px;
			.quick-tool {
				position: relative;
			}
			div.login-status {
				float: left;
				color: #0174ff;
				position: relative;
				>div {
					display: none;
					line-height: normal;
					color: #000;
					z-index:1000;
					padding: 15px 20px;
					width: 197px;
					height: 208px;
					background: #fff;
					position: absolute;
					top: 48px;
					text-align: center;
					left: -65px;
					border: 3px solid #ddd;
					li:first-of-type {
						padding-bottom: 8px;
						border-bottom: 1px solid #b5b6b6;
						margin-bottom: 3px;
					}
					li:nth-of-type(4){
						padding-bottom:3px;
						border-bottom: 1px solid #b5b6b6;
					}
					li:last-of-type {
						i {
							color: #a3a3a3;
							font-size: 20px;
							vertical-align: middle;
							margin-right: 8px;
						}
						margin-top: 3px;
					}
					a {
						float:none;
						letter-spacing: 3px;
						height: 36px;
						line-height: 36px;
						display: block;
						&:hover {
							background: #ddddde;
						}
					}
					&:before {
						content: '';
						position: absolute;
						border: 5px solid transparent;
						right: 20px;
						top: -13px;
						border-bottom-color: #ddd;
					}
				}
			}
			a, span, .tools {
				float: left;
			}
			span {
				margin: 0 5px;
			}
			.tool {
				float: left;
				margin-top: 10px;
				.searchForm{
					width: 115px;
					height: 30px;
					margin-left: 20px;
					background: white;
					border: 1px solid #636363;
					input {
						border: none;
					}
				}
				div.quickSearch {
					position: relative;
					padding: 3px 25px 3px 5px;
					input {
						width: 80px;
					}
					button {
						position: absolute;
						right: 5px;
						top: 3px;
						display: inline-block;
						width: 105px;
						height: 22px;
						border: none;
						line-height: normal;
						background-color: transparent;
						background-image: url("../images/background/icon-search.png");
						background-repeat: no-repeat;
						background-position: 100% 0;
						color: #b4b4b5;
						cursor: pointer;
						text-align: left;
					}
				}
				a.loginBtn {
					display: inline-block;
					height: 30px;
					padding: 0 10px;
					background-color: #636363;
					color: #fff;
					line-height: 30px;
					text-decoration: none;
				}
			}
			div.searchPanel {
				top: 63px;
				color: #000;
				z-index: 1000;
				display: none;
				line-height: 24px;
				background: white;
				border-top: 1px solid #eee;
				box-shadow: 0 3px 4px 0px #ddd;
				padding: 15px;
				width: 340px;
				height: 240px;
				position: absolute;
				fieldset {
					margin-bottom: 10px;
					>div {
						overflow: hidden;
						padding-bottom: 5px;
						margin-bottom: 10px;
						border-bottom: 1px solid  #b5b6b6;
						span {
							float: left;
						}
						a {
							font-size: 16px;
							float: right;
						}
					}
					li {
						width: 49%;
						border: 1px solid #d7d8d8;
						float: left;
						span.input-group-addon {
							background: none;
							border: none;
							padding: 3px 0 0 0;

						}
						input {
							margin-left:20px;
							width: 106px;
						}
						&:last-of-type {
							margin-left: 2%
						}
					}

				}
				fieldset.byPlace {
					input {
						width: 100%;
						padding:5px;
						border: 1px solid #d7d8d8;
					}
				}
				.actions {
					width: 150px;
					height: 35px;
					background: #2577e3;
					padding:5px;
					i {
						font-size: 28px;
						color: #fff;
						margin-left: 10px;
					}
					button {
						color: #fff;
						font-size: 20px;
					}
				}
				&:before {
					position: absolute;
					top: -20px;
					left: 10px;
					display: block;
					height: 12px;
					width: 33px;
					background: transparent url("../images/background/arrow.png") no-repeat;
					content: '';
				}
			}
			.fl {
				margin-left: 25px;
				i {
					font-size: 18px;
				}
				b {
					font-size: 16px;
				}
			}
		}
	}
	.wrap {
		width: 1200px;
		margin: 0 auto;
		.head-contain {
			height: 85px;
			.logo {
				width: 156px;
				height: 128px;
				float: left;
				box-shadow: 3px 3px 3px #ddd;
				background: url('../images/logo.png');
			}
			ul {
				float: left;
				margin-top: 32px;
				margin-left: 240px;
				li {
					font-size: 20px;
					float: left;
					position: relative;
					cursor: pointer;
					background: white;
					padding: 0 30px 25px;
					&:hover {
						color: #2577e3;
					}
					.hot {
						width: 31px;
						height: 16px;
						position: absolute;
						right: 30px;
						top: -15px;
						background: url('../images/hot.png')
					}
					>div.xiala {
						width: 108px;
						display: none;
						position: absolute;
						top: 100%;
						left: 0;
						box-shadow: 3px 4px 5px 0px #7d7c7c;
						.arrow {
							position: absolute;
							top: -15px;
							left: 0;
							display: block;
							height: 12px;
							width: 100%;
							background: transparent url("../images/background/arrow.png") no-repeat center;
							content: '';
						}
						a {
							display: block;
							font-size: 16px;
							background: white;
							text-align: center;
							height: 35px;
							line-height: 35px;
							&:hover {
								background: #ddddde
							}
						}
					}
				}
				li.theme-travel {
					>div.xiala {
						left: 33px;
					}
				}
			}
		}
	}
}

footer {
	width: 100%;
	color: #898989;
	margin-top: 14px;
	background: #ebebeb;
	.wrapper {
		width: 1200px;
		margin: 0 auto;
		text-align: center;
		color: #898989;
		div.footer-top {
			height: 77px;
			font-size: 16px;
			display: flex;
			justify-content: center;
			align-items: center;
			border-top: 1px solid #d4d4d4;
			border-bottom: 1px solid white;
			img {
				margin: 0 5px;
			}
		}
		div.footer-bottom {
			padding: 15px 0;
			border-top: 1px solid #d4d4d4;
			line-height: 24px;
			font-size: 12px;
			position: relative;
			i {
				position: absolute;
				right: 0;
			}
		}
	}
}
.triangle-left {
	width: 0;
	height: 0;
	border-top: 6px solid transparent;
	border-right: 6px solid #cccccc;
	border-bottom: 6px solid transparent;
}
.triangle-right {
	width: 0;
	height: 0;
	border-top: 6px solid transparent;
	border-left: 6px solid #2577e3;
	border-bottom: 6px solid transparent;
}
.paginations {
	float: right;
	margin-top: 20px;
	.triangle-right {
		display: inline-block;
		position: relative;
		margin-left: 3px;
		top: 1px;
	}
	ul {
		float: left;
		overflow: hidden;
		li {
			cursor: pointer;
			color: #2577e3;
			margin-right: 2px;
			list-style: none;
			border: 1px solid #ccc;
			padding: 2px 7px;
			float: left;
		}
		li.active {
			background: #619eff;
			color: white;
		}
		li:first-of-type{
			width: 26px;
			height: 26px;
			padding-top: 7px;
			margin-right: 11px;
		}
		li:last-of-type {
			height: 25px;
    		line-height: 20px;
			margin-left: 9px;
			margin-right: 13px;
		}
	}
	.contain {
		display: table-cell;
		vertical-align: middle;
		text-align: center;
		height: 25px;
		input {
			width: 33px;
			height: 21px;
			margin: 0 5px;
			border: 1px solid #ccc;
		}
		button {
			height:23px;
			font-size: 14px;
			border: 1px solid #ccc;
			background:none;
		}
	}
}
aside.contact-way{
	position: fixed;
	right: 0;
	top: 50%;
	z-index: 100;
	.contact-contain {
		.wx-phone {
			>div {
				padding-left:20px;
					.phone {
					width: 80px;
					position: relative;
					height: 50px;
					cursor: pointer;
					background: #656565;
					text-align: center;
					line-height: 50px;
					border-top-left-radius: 2px;
					border-top-right-radius: 2px;
					border-bottom: 1px solid #8c8c8c;
					.phone-detail {
						display: none;
						width: 157px;
						height: 50px;
						top: 0;
						right: 90px;
						border: 1px solid #aaa;
						line-height: 50px;
						background: white;
						position: absolute;
						border-radius: 2px;
						&:before {
							content: '';
							border: 5px solid transparent;
							border-left: 5px solid #fff;
							position: absolute;
							top: 20px;
							z-index: 20;
							right: -10px;
						}
						p {
							position: absolute;
						    right: -6px;
    						top: 19px;
    						z-index: 10;
    						border-left: 6px solid #aaa;	
						}
					}
				}
				
				.wx {
					position: relative;
					width: 80px;
					height: 50px;
					cursor: pointer;
					background: #656565;
					text-align: center;
					line-height: 50px;
					border-bottom-left-radius: 2px;
					border-bottom-right-radius: 2px;
					.wx-detail {
						display: none;
						width: 157px;
						height: 194px;
						position: absolute;
						right: 90px;
						bottom: 0;
						border-radius: 2px;
						border: 1px solid #aaa;
						&:before {
							content: '';
							border: 5px solid transparent;
							border-left: 5px solid #fff;
							position: absolute;
							bottom: 20px;
							z-index: 20;
							right: -10px;
						}
						img {
							width: 100%;
							height: 100%;
						}
						p {
							position: absolute;
						    right: -6px;
    						bottom: 19px;
    						border-left: 6px solid #aaa;
    						
						}
					}
				}
				img {
					vertical-align: middle;
				}
			}
		}
		.arrow {
			display: none;
			cursor: pointer;
			margin-left: 20px;
			width: 80px;
			height: 50px;
			margin-top: 5px;
			background: #656565;
			text-align: center;
			line-height: 50px;
		}
	}
}